<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <ul>

    </ul>
    <script src="./js/axios.js"></script>
    <script>
        let uid = localStorage.getItem("id");
      console.log(uid);
      let url = "http://jx.xuzhixiang.top/ap/api/cart-list.php";
      axios.get(url, { params: { id: uid } }).then((r) => {
        console.log(r.data);
        let cartArr = r.data.data;
        console.log(cartArr);
        let liArr = cartArr.map(
          (v) => `
            <li>
                <p>${v.pname}</p></br>
                <img src="${v.pimg}" alt="" /></br>
                <p>${v.pprice}</p></br>
                <p>${v.pdesc}</p></br>
                <input type="number" value="${v.pnum}" min="1" onchange="pnumChange(${v.pid},this)">
                <button onclick="delClick(${v.pid},this)">删除</button>
            </li>
          `
        );
        document.querySelector("ul").innerHTML = liArr;
      });
      async function delClick(pid, btn) {
        console.log(pid);
        console.log(btn);
       
        console.log(uid);
        let url = "http://jx.xuzhixiang.top/ap/api/cart-delete.php";
        let r1 = await axios.get(url, { params: { uid, pid } });
        console.log(r1.data);
        alert(r1.data.msg);
        btn.parentNode.remove();
      }
      async function pnumChange(pid, ipt) {
        console.log(pid);
        console.log(ipt);
        let pnum = ipt.value;
        let url = "http://jx.xuzhixiang.top/ap/api/cart-update-num.php";
        let r2 = await axios.get(url, { params: { uid, pid, pnum } });
        console.log(r2.data);
      }
            </script>
</body>
</html>